<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets">
<h:head>
<style type="text/css" >
	table,td,th {
		border-collapse:collapse;
		border:1px solid black;
	}
	td {
		padding:10px;
	}
	th {
		padding:5px;
		background-color:lightgrey;
		color:black;
	}
	.header {
		color:Brown; 
		font-weight: bold;
	}
	.totalRow {
		color:Brown;
		font-weight: bold;
	}
</style>
<script type="text/javascript">
	function reNew(bDate, eDate){
		var testArea  = document.getElementById("mainForm:testArea");
		var reNew     = document.getElementById("mainForm:renew");
		if(bDate<eDate){
			alert("Dates don't match!");
		} else {
			alert("Dates matched!");
		}
		testArea.value = "TESTED";
		reNew.action = "#{paymentBoundary.getPaymentList()}";
		reNew.submit();		
	}		
</script>
</h:head>

<h:form id="mainForm">
	
	<h:outputText value="Данные по поступлению денежных средств" styleClass="header"/>
	<br/><br/>
	<h:outputText value="Период с "/>
	<h:inputText id="dateBegin" value="#{paymentBoundary.dateBegin}" style="width: 130px">
		<f:convertDateTime pattern="d/MM/yyyy"/>
	</h:inputText>
	<h:outputText value=" по "/>
	<h:inputText id="dateEnd" value="#{paymentBoundary.dateEnd}" style="width: 130px">
		<f:convertDateTime pattern="d/MM/yyyy"/>
	</h:inputText>
	<h:outputText value=" Курс"/>
	<h:inputText id="currencyRate" value="#{paymentBoundary.currencyRate}" style="width: 80px">
		<f:convertNumber pattern="#0.00"/>
	</h:inputText>
	<h:commandButton id="renew" value="Обновить" onclick="reNew('#{paymentBoundary.dateBegin}', '#{paymentBoundary.dateEnd}')"/>
	<br/><br/>
	<h:outputText id="testArea" value=""/>
	<br/><br/>
	<h:dataTable value="#{paymentBoundary.paymentList}" var="plist">
		<h:column>
			<f:facet name="header">
				<h:outputText value="Фирма"/>
			</f:facet>		
			<h:outputText styleClass="#{plist.totalRow ? 'totalRow' : null}" value="#{plist.companyName}"/>
		</h:column>
		<h:column>
			<f:facet name="header">
				<h:outputText value="Нал"/>
			</f:facet>		
			<h:outputText value="#{plist.cashPayment}" styleClass="#{plist.totalRow ? 'totalRow' : null}">
				<f:convertNumber pattern="###,###,###,###,##0.00"/>
			</h:outputText>
		</h:column>
		<h:column>
			<f:facet name="header">
				<h:outputText value="Безнал"/>
			</f:facet>		
			<h:outputText value="#{plist.bankPayment}" styleClass="#{plist.totalRow ? 'totalRow' : null}">
				<f:convertNumber pattern="###,###,###,###,##0.00"/>
			</h:outputText>
		</h:column>
		<h:column>
			<f:facet name="header">
				<h:outputText value="Всего"/>
			</f:facet>		
			<h:outputText value="#{plist.totalPayment}" styleClass="#{plist.totalRow ? 'totalRow' : null}">
				<f:convertNumber pattern="###,###,###,###,##0.00"/>
			</h:outputText>
		</h:column>
		<h:column>
			<f:facet name="header">
				<h:outputText value="Всего, $"/>
			</f:facet>		
			<h:outputText  value="#{plist.totalPaymentInCurrency}"  styleClass="#{plist.totalRow ? 'totalRow' : null}">
				<f:convertNumber pattern="###,###,###,###,##0.00"/>
			</h:outputText>
		</h:column>
	</h:dataTable>    
</h:form>
</html>